<template>
    <iframe :src="html"></iframe>
</template>

<script>
import request from '@/utils/request'
export default {
  name: 'HtmlLoad',
  // 使用时请使用 :url.sync=""传值
  props: {
    url: {
      required: true
    }
  },
  data(){
    return {
      loading: false,
      html:''
    }
  },
  watch: {
    url (value) {
      this.load(value)
    }
  },
  mounted () {
    this.load(this.url)
  },
  methods: {
    load(url){
      if (url && url.length > 0) {
        this.loading = true
        request({
          url: url,
          methods: 'get',
          Headers: {isToken: false},
          data: {accept: 'text/html, text/plain'}
        }).then(res => {
          this.loading = false
          // 处理HTML显示
          this.html = res
        }).catch(() => {
          this.loading = false
          this.html = '加载失败'
        })
      }
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
